:root {
  --dark-primary-color: 34, 39, 46;
  --dark-secondary-color: #2d333b;
  --dark-tertiary-color: #646464;
  --dark-text-color: white;
}

html {
  background-color: rgb(var(--dark-primary-color));
  color: var(--dark-text-color);
  fill: var(--dark-text-color);
}

.header {
  background-color: rgba(var(--dark-primary-color), 0.95);
}

.nav-hamburger-list {
  background: rgba(var(--dark-primary-color), 1);
}

.nav-links .nav-icons-divider {
  color: var(--dark-secondary-color);
}

a:hover .feather-moon {
  fill: white;
  color: white;
}

.social-icons-list .social-icon,
.social-icons-list .social-icon a:visited  {
  fill: var(--dark-text-color);
}

.social-icons-list .social-icon a:hover {
  fill: var(--accent-color);
}

.post-tags .post-tag:hover {
  background-color: var(--dark-text-color);
  color: rgb(var(--dark-primary-color));
}

.tags-list .post-tags .post-tag a .tag-posts-count {
  background-color: var(--dark-secondary-color);
}

.tags-list .post-tags .post-tag:hover a .tag-posts-count {
  background-color: var(--dark-text-color);
  color: rgb(var(--dark-primary-color));
}

.footer {
  border-top-color: var(--dark-header-bg-color);
}

blockquote {
  color: darkgrey;
  border-left-color: var(--dark-secondary-color);
}

hr {
  color: var(--dark-secondary-color);
}

table thead {
  background-color: var(--dark-secondary-color);
}

table td,
table th {
  border-bottom-color: var(--dark-secondary-color);
}

code,
pre {
  background-color: var(--dark-secondary-color) !important;
}

:not(pre) > code {
  background-color: var(--dark-tertiary-color) !important;
  color: var(--dark-text-color);
}

.header-shadow {
  box-shadow: rgb(33, 38, 45) 0px -1px 0px 0px inset;
}

/* TODO: Check if this is needed or not */
/* 
img,
video {
  filter: hue-rotate(180deg) contrast(100%) invert(100%);
  -webkit-filter: hue-rotate(180deg) contrast(100%) invert(100%);
} 
*/
